const gulp = require("gulp");
const sass = require("gulp-sass")(require("sass"));
const connect = require("gulp-connect");
const sourcemaps = require("gulp-sourcemaps");

gulp.task("copyHtml", done => {
    gulp.src("*.html").pipe(gulp.dest("dist")).pipe(connect.reload());
    done();
});
gulp.task("sass", done => {
    gulp.src("sass/*.scss")
        .pipe(sourcemaps.init())
        .pipe(sass({
            outputStyle: "compressed"
        }))
        .pipe(sourcemaps.write("./"))
        .pipe(gulp.dest("dist/css"))
        .pipe(connect.reload());
    done();
})
gulp.task("copyImg", done => {
    gulp.src("img/**").pipe(gulp.dest("dist/img"))
        .pipe(connect.reload());
    done();
});

gulp.task("copyJs", done => {
    gulp.src("js/**").pipe(gulp.dest("dist/js"))
        .pipe(connect.reload());
    done();
});

gulp.task("watch", done => {
    gulp.watch("*.html", gulp.series("copyHtml"));
    gulp.watch("sass/*.scss", gulp.series("sass"));
    gulp.watch("img/**", gulp.series("copyImg"));
    gulp.watch("js/**", gulp.series("copyJs"));
    done();
})
gulp.task("server", done => {
    connect.server({
        root: "dist",
        livereload: true
    })
    done();
})

gulp.task("default", gulp.series("server", "watch"));